
#{if _organizacion!=null}
	<h2 id="crudShowTitle">Agregar Arcadiano 
	<img id="addOrganizacionArcadiano" src="/public/images/Add.png" alt="Add">
	</h2>
	<div class="arcadianos">
		<table id="arcadianos">		
			<thead>
				<tr>
					<th>Nivel</th>
					<th>Nombre</th>
					<th></th>
				</tr>
			</thead>
			#{list items:_arcadianosOrganizacion, as:'arcadianoorganizacion'}				
				<tr>
					<td>${arcadianoorganizacion.level}</td>
					<td>${arcadianoorganizacion.arcadiano.nombre}</td>
					<td>
	 					<a href="@{Organizaciones.removeArcadiano(_organizacion, arcadianoorganizacion.arcadiano.id)}#arcadianos" class="arcadiano" ><img height="16px" width="16px" id="removeArcadiano" src="/public/images/delete.gif" alt="remove"></a>
	 					
	 					#{if arcadianoorganizacion.level > 1}
	 					<a href="@{Organizaciones.upLevel(_organizacion, arcadianoorganizacion.arcadiano.id)}#arcadianos" class="arcadiano" ><img src="/public/images/uparrow.png" alt="True"></a>	 					
	 					#{/if}
	 					
	 					#{if arcadianoorganizacion.level < _lastArcadiano}
	 					<a href="@{Organizaciones.downLevel(_organizacion, arcadianoorganizacion.arcadiano.id)}#arcadianos" class="arcadiano" ><img src="/public/images/downarrow.png" alt="True"></a>
	 					#{/if}
	 					
					</td>
				</tr>
			#{/list}
		</table>	
	</div>
	
	<div id="dialog-organizacion-arcadianos"  style="display: none" class="dialog-style">
		<h2 id="crudShowTitle">&{'crud.blank.title', 'Arcadianos'}
		<input type="text" id="arcadianoNameOrganizacionSearch" name="arcadianoNameOrganizacionSearch">
		<img id="nuevoArcadiano" src="/public/images/Add.png" alt="Add">
		</h2>
		<div class="objectForm">
			<div class="crudField crud_text" id="arcadianosOrganizacionDiv">
				<table id="arcadianosOrganizacionTable">			
					#{list items:_arcadianos, as:'arcadiano'}				
						<tr><td><a href="@{Organizaciones.asociarArcadiano(_organizacion, arcadiano.id)}" class="arcadiano" >${arcadiano.nombre}</a></td></tr>
					#{/list}
				</table>
			</div>
		</div>	
	</div> 
	
	<div id="dialog-nuevo-arcadiano"  style="display: none" class="dialog-style" >
		<h2 id="crudShowTitle">&{'crud.blank.title', 'Arcadiano'}
		</h2>
		<div id="nuevoArcadianoError"></div>
		<div class="objectForm">
			<div class="crudField crud_text">
				<label for = "nombreNuevoArcadiano">Nombre</label><input type="text" id="nombreNuevoArcadiano" name="nombreNuevoArcadiano" value="">
			</div>
			<input type="button" value="Save" onclick="saveNuevoArcadiano();">
		</div>		
	</div> 

<script type="text/javascript">
$().ready(function() {
	
	$( "#dialog-organizacion-arcadianos").dialog({
		autoOpen: false,
	    width: 550, 
	    maxWidth: 550,
	    minWidth: 430,
		height: 'auto',
		fluid: true, 
	    resizable: false,
	    dialogClass: "dialog-style",
	    open: function(event, ui){
	    },
	    close: function(event, ui){
	    	$( "#dialog-organizacion-arcadianos" ).dialog( "close" );
	    }
	});
	$( "#dialog-nuevo-arcadiano").dialog({
		autoOpen: false,
	    width: 550, 
	    maxWidth: 550,
	    minWidth: 430,
		height: 'auto',
		fluid: true, 
	    resizable: false,
	    dialogClass: "dialog-style",
	    open: function(event, ui){
	    },
	    close: function(event, ui){
	    	$( "#dialog-nuevo-arcadiano" ).dialog( "close" );
	    }
	});
	$("#arcadianoNameOrganizacionSearch").keyup(function() {
		  searchOrganizacionArcadianos();
	});
	$( "#addOrganizacionArcadiano" ).click(function() {
		$( "#dialog-organizacion-arcadianos" ).dialog( "open" );
		return false;
	});
	$( "#nuevoArcadiano" ).click(function() {
		$( "#dialog-nuevo-arcadiano" ).dialog( "open" );
		return false;
	});
	
	
})

function searchOrganizacionArcadianos(){
	$.get("/Arcadianos/search",  {
		id: ${_organizacion},
		nombre: $("#arcadianoNameOrganizacionSearch").val()
	},function(data, id){
		if(data[0] != 'ERROR'){
			$("#arcadianosOrganizacionTable").remove();
			var arcadianos = JSON.parse(data[1]);
			var i = 0;
			html = "<table id='arcadianosOrganizacionTable'>";
			for(i = 0; i < arcadianos.length; i++) {
				html = html + 
				"<tr><td><a href='/Organizaciones/asociarArcadiano?id=${_organizacion}&arcadianoid="+arcadianos[i].id+"' class='arcadiano' >"+arcadianos[i].nombre+"</a></td></tr>";
			}
			html = html + "</table>";
			$("#arcadianosOrganizacionDiv").append(html);
			return false;
		}else {
			return false;
		}
		
	},'json');
}
function saveNuevoArcadiano(){
	nombre = $("#nombreNuevoArcadiano").val();
	if (nombre==null || nombre=='')
		$("#nuevoArcadianoError").append("error");
	else {
		$.get("/Organizaciones/newArcadiano",  {
			id: '${_organizacion}',
			nombre: nombre		
		},function(data){
			if(data[0] != 'ERROR'){
				window.location.assign("/admin/organizaciones/${_organizacion}");
				return false;
			}else {
				alert(data[1]);
				return false;
			}
			
		},'json');
	}
}

</script>
#{/if}